<template>
	<view class="main">
		<form class="form" @submit="formSubmit" @reset="formReset">
			<view class="ele">
				<label for="name">昵称</label>
				<input class="input" id="name" v-model="formData.user_name" placeholder="请输入昵称"/>
			</view>
			<view class="ele">
				<label for="email">邮箱</label>
				<input class="input" id="email" v-model="formData.email" placeholder="请输入邮箱"/>
			</view>
			<view class="ele">
				<label for="id">账号</label>
				<input class="input" id="id" v-model="formData.user_id" placeholder="请输入账号"/>
			</view>
			<view class="ele">
				<label for="uni-input-password">密码</label>
				<input id="uni-input-password" class="input" password="true" v-model="formData.password" />
			</view>
			<label for="code">验证码</label>
			<view class="ele1">
				<input class="code" id="code" v-model="code" placeholder="验证码"/>
				<button type="primary" @click="getCode(formData.user_id,formData.email)">获取验证码</button>
			</view>
			<view class="ele">
				<button form-type="submit">Submit</button>
				<button type="default" form-type="reset">Reset</button>
			</view>
			<view>
				<text class="text" @click="login">已有账号点击登录-></text>
			</view>
		</form>
	</view>
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue';
import {regiester } from '../../../public/p_interface';

	var code = '';
	let formData = reactive<regiester>({user_id: null,user_name:'',email:'',password:''})
	
	const formSubmit = () =>{
		uni.request({
		    url: 'http://121.40.242.216:8081/api/user/add?code='+code,
			method:'POST',
		    data: {
		        user_id:formData.user_id,
		        user_name:formData.user_name,
		        password:formData.password,
		        email:formData.email
		    },
		    header: {
				'Content-Type': 'application/json'
		    },
		    success: (res) => {
		        console.log(res.data);
		    }
		});
		console.log(formData)
		uni.navigateTo({
		    url: '/pages/regiest/signin/signin'
		}); 
	}
	const formReset = () =>{
		
	}
	const getCode = (id:number,email:string) =>{
		uni.request({
		    url: 'http://121.40.242.216:8081/api/user/getcode',
			method:'POST',
		    data: {
		        user_id:id,
				user_email:email
		    },
		    header: {
		        'custom-header': 'hello'
		    },
		    success: (res) => {
		        console.log(res.data);
		    }
		});
		console.log("获取验证码")
	}
	const login =()=>{
		uni.navigateTo({
		    url: '/pages/regiest/signin/signin'
		}); 
	}
	
</script>

<style>
.text{
	float: right;
	font-family: 'Georgia', serif;
}
.form{
	margin-top: 500rpx;
}
.input{
	width: 680rpx;
	height: 100rpx;
	background: aliceblue;
	border-radius: 30rpx;
}
.code{
	width: 360rpx;
	height: 100rpx;
	background: aliceblue;
	border-radius: 30rpx;
}
.ele1{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
}
.main{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction:column;
	width: 100%;
	border-radius: 20%;
	height: 500rpx;
	}
</style>
